<!DOCTYPE html>
<html lang="zh-CN" dir="ltr">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>样式美化 | VitePress基础框架</title>
    <meta name="description" content="VitePress基础框架的站点描述">
    <meta name="generator" content="VitePress v1.3.4">
    <link rel="preload stylesheet" href="/vitepress-template-public/assets/style.Bh2VXVad.css" as="style">
    <script type="module" src="/vitepress-template-public/assets/chunks/metadata.6b2f4039.js"></script>
    <script type="module" src="/vitepress-template-public/assets/app.CtFKj54A.js"></script>
    <link rel="preload" href="/vitepress-template-public/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin="">
    <link rel="modulepreload" href="/vitepress-template-public/assets/chunks/theme.CHXT_227.js">
    <link rel="modulepreload" href="/vitepress-template-public/assets/chunks/framework.BCtciejH.js">
    <link rel="modulepreload" href="/vitepress-template-public/assets/guide_plugin_style.md.C4D42MkK.lean.js">
    <link rel="icon" type="image/svg+xml" href="/vitepress-template-public/logo/vitepress-logo-mini.svg">
    <link rel="icon" type="image/png" href="/vitepress-template-public/logo/vitepress-logo-mini.png">
    <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
    <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
  </head>
  <body>
    <div id="app"><div class="Layout" data-v-e7ae3156><!--[--><!--]--><!--[--><span tabindex="-1" data-v-b6dc82ed></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-b6dc82ed> Skip to content </a><!--]--><!----><header class="VPNav" data-v-e7ae3156 data-v-dd74d679><div class="VPNavBar" data-v-dd74d679 data-v-f294b04e><div class="wrapper" data-v-f294b04e><div class="container" data-v-f294b04e><div class="title" data-v-f294b04e><div class="VPNavBarTitle has-sidebar" data-v-f294b04e data-v-612ad8f1><a class="title" href="/vitepress-template-public/" data-v-612ad8f1><!--[--><!--]--><!--[--><img class="VPImage logo" src="/vitepress-template-public/logo/vitepress-logo-mini.svg" width="24" height="24" alt data-v-50300c68><!--]--><span data-v-612ad8f1>VitePress基础框架</span><!--[--><!--]--></a></div></div><div class="content" data-v-f294b04e><div class="content-body" data-v-f294b04e><!--[--><!--]--><div class="VPNavBarSearch search" data-v-f294b04e><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="搜索文档"><span class="DocSearch-Button-Container"><span class="vp-icon DocSearch-Search-Icon"></span><span class="DocSearch-Button-Placeholder">搜索文档</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-f294b04e data-v-fa8254e6><span id="main-nav-aria-label" class="visually-hidden" data-v-fa8254e6> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/vitepress-template-public/guide/install" tabindex="0" data-v-fa8254e6 data-v-8b7bfc54><!--[--><span data-v-8b7bfc54>教程</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/vitepress-template-public/examples/markdown" tabindex="0" data-v-fa8254e6 data-v-8b7bfc54><!--[--><span data-v-8b7bfc54>示例</span><!--]--></a><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-fa8254e6 data-v-e261b7a7><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-e261b7a7><span class="text" data-v-e261b7a7><!----><span data-v-e261b7a7>下拉导航</span><span class="vpi-chevron-down text-icon" data-v-e261b7a7></span></span></button><div class="menu" data-v-e261b7a7><div class="VPMenu" data-v-e261b7a7 data-v-0430342e><div class="items" data-v-0430342e><!--[--><!--[--><div class="VPMenuGroup" data-v-0430342e data-v-11db401e><p class="title" data-v-11db401e>下拉导航标题</p><!--[--><!--[--><div class="VPMenuLink" data-v-11db401e data-v-3da97ee6><a class="VPLink link vp-external-link-icon" href="https://github.com/dcdy/vitepress-template/edit/main/docs/.vitepress/config.mts" target="_blank" rel="noreferrer" data-v-3da97ee6><!--[-->子项A<!--]--></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-11db401e data-v-3da97ee6><a class="VPLink link vp-external-link-icon" href="https://gitee.com/xia_mei_ting/vitepress-template/blob/main/docs/.vitepress/config.mts" target="_blank" rel="noreferrer" data-v-3da97ee6><!--[-->子项B<!--]--></a></div><!--]--><!--]--></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-fa8254e6 data-v-e261b7a7><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-e261b7a7><span class="text" data-v-e261b7a7><!----><span data-v-e261b7a7>设置</span><span class="vpi-chevron-down text-icon" data-v-e261b7a7></span></span></button><div class="menu" data-v-e261b7a7><div class="VPMenu" data-v-e261b7a7 data-v-0430342e><div class="items" data-v-0430342e><!--[--><!--[--><!----><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-f294b04e data-v-cfa3e56c><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="false" data-v-cfa3e56c data-v-534bc2ea data-v-48850b97><span class="check" data-v-48850b97><span class="icon" data-v-48850b97><!--[--><span class="vpi-sun sun" data-v-534bc2ea></span><span class="vpi-moon moon" data-v-534bc2ea></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-f294b04e data-v-dcbce86c data-v-46044fd4><!--[--><a class="VPSocialLink no-icon" href="https://github.com/dcdy/vitepress-template" aria-label="github" target="_blank" rel="noopener" data-v-46044fd4 data-v-add20255><span class="vpi-social-github" /></a><a class="VPSocialLink no-icon" href="https://gitee.com/xia_mei_ting/vitepress-template" aria-label target="_blank" rel="noopener" data-v-46044fd4 data-v-add20255><svg t="1727428813465" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2268" width="200" height="200"><path d="M512 1024C229.222 1024 0 794.778 0 512S229.222 0 512 0s512 229.222 512 512-229.222 512-512 512z m259.149-568.883h-290.74a25.293 25.293 0 0 0-25.292 25.293l-0.026 63.206c0 13.952 11.315 25.293 25.267 25.293h177.024c13.978 0 25.293 11.315 25.293 25.267v12.646a75.853 75.853 0 0 1-75.853 75.853h-240.23a25.293 25.293 0 0 1-25.267-25.293V417.203a75.853 75.853 0 0 1 75.827-75.853h353.946a25.293 25.293 0 0 0 25.267-25.292l0.077-63.207a25.293 25.293 0 0 0-25.268-25.293H417.152a189.62 189.62 0 0 0-189.62 189.645V771.15c0 13.977 11.316 25.293 25.294 25.293h372.94a170.65 170.65 0 0 0 170.65-170.65V480.384a25.293 25.293 0 0 0-25.293-25.267z" fill="#C71D23" p-id="2269"></path></svg></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-f294b04e data-v-be29ddb3 data-v-e261b7a7><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-e261b7a7><span class="vpi-more-horizontal icon" data-v-e261b7a7></span></button><div class="menu" data-v-e261b7a7><div class="VPMenu" data-v-e261b7a7 data-v-0430342e><!----><!--[--><!--[--><!----><div class="group" data-v-be29ddb3><div class="item appearance" data-v-be29ddb3><p class="label" data-v-be29ddb3>主题</p><div class="appearance-action" data-v-be29ddb3><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="false" data-v-be29ddb3 data-v-534bc2ea data-v-48850b97><span class="check" data-v-48850b97><span class="icon" data-v-48850b97><!--[--><span class="vpi-sun sun" data-v-534bc2ea></span><span class="vpi-moon moon" data-v-534bc2ea></span><!--]--></span></span></button></div></div></div><div class="group" data-v-be29ddb3><div class="item social-links" data-v-be29ddb3><div class="VPSocialLinks social-links-list" data-v-be29ddb3 data-v-46044fd4><!--[--><a class="VPSocialLink no-icon" href="https://github.com/dcdy/vitepress-template" aria-label="github" target="_blank" rel="noopener" data-v-46044fd4 data-v-add20255><span class="vpi-social-github" /></a><a class="VPSocialLink no-icon" href="https://gitee.com/xia_mei_ting/vitepress-template" aria-label target="_blank" rel="noopener" data-v-46044fd4 data-v-add20255><svg t="1727428813465" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2268" width="200" height="200"><path d="M512 1024C229.222 1024 0 794.778 0 512S229.222 0 512 0s512 229.222 512 512-229.222 512-512 512z m259.149-568.883h-290.74a25.293 25.293 0 0 0-25.292 25.293l-0.026 63.206c0 13.952 11.315 25.293 25.267 25.293h177.024c13.978 0 25.293 11.315 25.293 25.267v12.646a75.853 75.853 0 0 1-75.853 75.853h-240.23a25.293 25.293 0 0 1-25.267-25.293V417.203a75.853 75.853 0 0 1 75.827-75.853h353.946a25.293 25.293 0 0 0 25.267-25.292l0.077-63.207a25.293 25.293 0 0 0-25.268-25.293H417.152a189.62 189.62 0 0 0-189.62 189.645V771.15c0 13.977 11.316 25.293 25.294 25.293h372.94a170.65 170.65 0 0 0 170.65-170.65V480.384a25.293 25.293 0 0 0-25.293-25.267z" fill="#C71D23" p-id="2269"></path></svg></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-f294b04e data-v-63d80599><span class="container" data-v-63d80599><span class="top" data-v-63d80599></span><span class="middle" data-v-63d80599></span><span class="bottom" data-v-63d80599></span></span></button></div></div></div></div><div class="divider" data-v-f294b04e><div class="divider-line" data-v-f294b04e></div></div></div><!----></header><div class="VPLocalNav has-sidebar empty" data-v-e7ae3156 data-v-3a585b62><div class="container" data-v-3a585b62><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-3a585b62><span class="vpi-align-left menu-icon" data-v-3a585b62></span><span class="menu-text" data-v-3a585b62>菜单</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-3a585b62 data-v-d6887fce><button data-v-d6887fce>回到顶部</button><!----></div></div></div><aside class="VPSidebar" data-v-e7ae3156 data-v-dbec4220><div class="curtain" data-v-dbec4220></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-dbec4220><span class="visually-hidden" id="sidebar-aria-label" data-v-dbec4220> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="no-transition group" data-v-3fb65e2d><section class="VPSidebarItem level-0 collapsible" data-v-3fb65e2d data-v-9529bbf6><div class="item" role="button" tabindex="0" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><h2 class="text" data-v-9529bbf6>简介</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-9529bbf6><span class="vpi-chevron-right caret-icon" data-v-9529bbf6></span></div></div><div class="items" data-v-9529bbf6><!--[--><div class="VPSidebarItem level-1 is-link" data-v-9529bbf6 data-v-9529bbf6><div class="item" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><a class="VPLink link link" href="/vitepress-template-public/guide/install" data-v-9529bbf6><!--[--><p class="text" data-v-9529bbf6>安装</p><!--]--></a><!----></div><!----></div><section class="VPSidebarItem level-1 collapsible" data-v-9529bbf6 data-v-9529bbf6><div class="item" role="button" tabindex="0" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><h3 class="text" data-v-9529bbf6>配置</h3><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-9529bbf6><span class="vpi-chevron-right caret-icon" data-v-9529bbf6></span></div></div><div class="items" data-v-9529bbf6><!--[--><div class="VPSidebarItem level-2 is-link" data-v-9529bbf6 data-v-9529bbf6><div class="item" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><a class="VPLink link link" href="/vitepress-template-public/guide/config-home" data-v-9529bbf6><!--[--><p class="text" data-v-9529bbf6>首页配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-2 is-link" data-v-9529bbf6 data-v-9529bbf6><div class="item" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><a class="VPLink link link" href="/vitepress-template-public/guide/config-doc" data-v-9529bbf6><!--[--><p class="text" data-v-9529bbf6>文档配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-2 is-link" data-v-9529bbf6 data-v-9529bbf6><div class="item" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><a class="VPLink link link" href="/vitepress-template-public/guide/config-other" data-v-9529bbf6><!--[--><p class="text" data-v-9529bbf6>其他配置</p><!--]--></a><!----></div><!----></div><!--]--></div></section><div class="VPSidebarItem level-1 is-link" data-v-9529bbf6 data-v-9529bbf6><div class="item" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><a class="VPLink link link" href="/vitepress-template-public/guide/layout-slot" data-v-9529bbf6><!--[--><p class="text" data-v-9529bbf6>布局插槽</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-3fb65e2d><section class="VPSidebarItem level-0 collapsible has-active" data-v-3fb65e2d data-v-9529bbf6><div class="item" role="button" tabindex="0" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><h2 class="text" data-v-9529bbf6>插件</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-9529bbf6><span class="vpi-chevron-right caret-icon" data-v-9529bbf6></span></div></div><div class="items" data-v-9529bbf6><!--[--><div class="VPSidebarItem level-1 is-link" data-v-9529bbf6 data-v-9529bbf6><div class="item" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><a class="VPLink link link" href="/vitepress-template-public/guide/plugin/image" data-v-9529bbf6><!--[--><p class="text" data-v-9529bbf6>图片</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-9529bbf6 data-v-9529bbf6><div class="item" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><a class="VPLink link link" href="/vitepress-template-public/guide/plugin/code" data-v-9529bbf6><!--[--><p class="text" data-v-9529bbf6>代码块</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-9529bbf6 data-v-9529bbf6><div class="item" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><a class="VPLink link link" href="/vitepress-template-public/guide/plugin/style" data-v-9529bbf6><!--[--><p class="text" data-v-9529bbf6>样式美化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-9529bbf6 data-v-9529bbf6><div class="item" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><a class="VPLink link link" href="/vitepress-template-public/guide/plugin/util" data-v-9529bbf6><!--[--><p class="text" data-v-9529bbf6>一些组件</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-3fb65e2d><section class="VPSidebarItem level-0 collapsible" data-v-3fb65e2d data-v-9529bbf6><div class="item" role="button" tabindex="0" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><h2 class="text" data-v-9529bbf6>部署</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-9529bbf6><span class="vpi-chevron-right caret-icon" data-v-9529bbf6></span></div></div><div class="items" data-v-9529bbf6><!--[--><div class="VPSidebarItem level-1 is-link" data-v-9529bbf6 data-v-9529bbf6><div class="item" data-v-9529bbf6><div class="indicator" data-v-9529bbf6></div><a class="VPLink link link" href="/vitepress-template-public/guide/github-pages" data-v-9529bbf6><!--[--><p class="text" data-v-9529bbf6>Github Pages</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-e7ae3156 data-v-9d495596><div class="VPDoc has-sidebar has-aside" data-v-9d495596 data-v-09fc73c3><!--[--><!--]--><div class="container" data-v-09fc73c3><div class="aside" data-v-09fc73c3><div class="aside-curtain" data-v-09fc73c3></div><div class="aside-container" data-v-09fc73c3><div class="aside-content" data-v-09fc73c3><div class="VPDocAside" data-v-09fc73c3 data-v-f2095285><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-f2095285 data-v-5ec4093d><div class="content" data-v-5ec4093d><div class="outline-marker" data-v-5ec4093d></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-5ec4093d>页面导航</div><ul class="VPDocOutlineItem root" data-v-5ec4093d data-v-31939393><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-f2095285></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-09fc73c3><div class="content-container" data-v-09fc73c3><!--[--><!--]--><main class="main" data-v-09fc73c3><div style="position:relative;" class="vp-doc _vitepress-template-public_guide_plugin_style external-link-icon-enabled" data-v-09fc73c3><div><h1 id="样式美化" tabindex="-1">样式美化 <a class="header-anchor" href="#样式美化" aria-label="Permalink to &quot;样式美化&quot;">​</a></h1><div class="caution custom-block github-alert"><p class="custom-block-title">注意</p><p></p><p>所有新增的<code>css</code>样式文件要放在<code>custom.css</code>文件下方</p></div><h2 id="unocss-同款首页动态颜色" tabindex="-1">UnoCSS 同款首页动态颜色 <a class="header-anchor" href="#unocss-同款首页动态颜色" aria-label="Permalink to &quot;UnoCSS 同款首页动态颜色&quot;">​</a></h2><p><span class="img-wrapper"><img src="https://cdn.jsdelivr.net/gh/dcdy/image/img/GIF%202024-12-17%2015-25-47_compressed.gif" alt="GIF 2024-12-17 15-25-47_compressed" width="auto" height="auto" class="img-loading" onload="this.classList.remove(&#39;img-loading&#39;)" onerror="this.classList.remove(&#39;img-loading&#39;); this.classList.add(&#39;img-error&#39;)"></span></p><p>新建<code>docs/.vitepress/theme/rainbow.css</code> 文件</p><details class="details custom-block"><summary>点击查看<code>rainbow.css</code> 文件内容</summary><div class="vp-code-block-title"><div class="vp-code-block-title-bar"><span class="vp-code-block-title-text" data-title="rainbow.css">rainbow.css</span></div><div class="language-css vp-adaptive-theme line-numbers-mode"><button title="复制代码" class="copy"></button><span class="lang">css</span><pre class="shiki shiki-themes OneLight dark-plus vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">/* 彩虹动画 */</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">@keyframes</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;"> rainbow</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	0% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#009ff7</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#c76dd1</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	1.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#009dfa</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#cf69c9</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	2.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#009bfc</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#d566c2</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	3.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#0098fd</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#dc63ba</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#0096fd</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#e160b3</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	6.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#0093fd</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#e65eab</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	7.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#2e90fc</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#e95ca2</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	8.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#4d8dfa</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#ed5a9a</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	10% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#638af8</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#ef5992</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	11.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#7587f5</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#f15989</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	12.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#8583f1</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#f25981</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	13.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#9280ed</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#f25a79</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	15% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#9f7ce9</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#f25c71</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	16.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#aa78e3</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#f15e69</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	17.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#b574dd</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#ef6061</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	18.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#be71d7</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#ed635a</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	20% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#c76dd1</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#eb6552</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	21.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#cf69c9</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#e8694b</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	22.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#d566c2</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#e46c44</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	23.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#dc63ba</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#e06f3d</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#e160b3</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#db7336</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	26.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#e65eab</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#d77630</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	27.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#e95ca2</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#d17a2a</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	28.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#ed5a9a</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#cc7d24</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	30% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#ef5992</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#c6811e</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	31.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#f15989</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#bf8418</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	32.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#f25981</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#b98713</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	33.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#f25a79</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#b28a0f</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	35% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#f25c71</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#ab8d0c</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	36.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#f15e69</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#a3900b</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	37.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#ef6061</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#9c920d</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	38.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#ed635a</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#949510</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	40% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#eb6552</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#8b9715</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	41.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#e8694b</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#83991b</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	42.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#e46c44</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#7a9b21</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	43.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#e06f3d</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#719d27</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	45% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#db7336</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#679e2e</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	46.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#d77630</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#5da035</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	47.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#d17a2a</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#51a13c</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	48.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#cc7d24</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#44a244</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	50% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#c6811e</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#34a44b</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	51.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#bf8418</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#1ba553</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	52.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#b98713</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a65b</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	53.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#b28a0f</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a663</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	55% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#ab8d0c</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a76c</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	56.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#a3900b</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a874</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	57.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#9c920d</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a87d</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	58.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#949510</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a985</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	60% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#8b9715</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a98e</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	61.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#83991b</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a996</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	62.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#7a9b21</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a99f</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	63.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#719d27</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a9a7</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	65% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#679e2e</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a9b0</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	66.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#5da035</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a9b8</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	67.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#51a13c</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a9c0</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	68.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#44a244</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a8c7</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	70% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#34a44b</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a8cf</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	71.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#1ba553</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a7d5</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	72.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a65b</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a6dc</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	73.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a663</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a6e2</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a76c</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a4e7</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	76.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a874</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a3ec</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	77.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a87d</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a2f1</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	78.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a985</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a0f4</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	80% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a98e</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#009ff7</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	81.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a996</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#009dfa</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	82.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a99f</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#009bfc</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	83.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a9a7</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#0098fd</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	85% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a9b0</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#0096fd</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	86.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a9b8</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#0093fd</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	87.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a9c0</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#2e90fc</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	88.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a8c7</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#4d8dfa</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	90% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a8cf</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#638af8</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	91.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a7d5</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#7587f5</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	92.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a6dc</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#8583f1</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	93.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a6e2</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#9280ed</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	95% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a4e7</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#9f7ce9</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	96.25% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a3ec</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#aa78e3</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	97.5% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a2f1</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#b574dd</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	98.75% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#00a0f4</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#be71d7</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	100% {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#009ff7</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#c76dd1</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">/* 彩虹色卡 */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">:root</span><span style="--shiki-light:#A626A4;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">.dark</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">	--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#009ff7</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">	--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#CE9178;">#c76dd1</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">	animation</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: rainbow </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">8s</span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;"> linear</span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;"> infinite</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">:root</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/* hero标题渐变色 */</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">	--vp-home-hero-name-color</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">transparent</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">	--vp-home-hero-name-background</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">-webkit-linear-gradient</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">120deg</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">var</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">30%</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">var</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">));</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/*hero logo背景渐变色 */</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">	--vp-home-hero-image-background-image</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">linear-gradient</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">-45deg</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">var</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">--rainbow-prev</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">30%</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">var</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">--rainbow-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">));</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">	--vp-home-hero-image-filter</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">blur</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">80px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">@media</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> (</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">min-width</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">640px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) {</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">	:root</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--vp-home-hero-image-filter</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">blur</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">120px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">@media</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> (</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">min-width</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">960px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) {</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">	:root</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		--vp-home-hero-image-filter</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">blur</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">120px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">/* Safari has a very bad performance on gradient and filter */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">.browser-safari</span><span style="--shiki-light:#A626A4;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">.browser-firefox</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">	--vp-home-hero-image-background-image</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">transparent</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">	--vp-home-hero-image-filter</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">&#39;&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br><span class="line-number">43</span><br><span class="line-number">44</span><br><span class="line-number">45</span><br><span class="line-number">46</span><br><span class="line-number">47</span><br><span class="line-number">48</span><br><span class="line-number">49</span><br><span class="line-number">50</span><br><span class="line-number">51</span><br><span class="line-number">52</span><br><span class="line-number">53</span><br><span class="line-number">54</span><br><span class="line-number">55</span><br><span class="line-number">56</span><br><span class="line-number">57</span><br><span class="line-number">58</span><br><span class="line-number">59</span><br><span class="line-number">60</span><br><span class="line-number">61</span><br><span class="line-number">62</span><br><span class="line-number">63</span><br><span class="line-number">64</span><br><span class="line-number">65</span><br><span class="line-number">66</span><br><span class="line-number">67</span><br><span class="line-number">68</span><br><span class="line-number">69</span><br><span class="line-number">70</span><br><span class="line-number">71</span><br><span class="line-number">72</span><br><span class="line-number">73</span><br><span class="line-number">74</span><br><span class="line-number">75</span><br><span class="line-number">76</span><br><span class="line-number">77</span><br><span class="line-number">78</span><br><span class="line-number">79</span><br><span class="line-number">80</span><br><span class="line-number">81</span><br><span class="line-number">82</span><br><span class="line-number">83</span><br><span class="line-number">84</span><br><span class="line-number">85</span><br><span class="line-number">86</span><br><span class="line-number">87</span><br><span class="line-number">88</span><br><span class="line-number">89</span><br><span class="line-number">90</span><br><span class="line-number">91</span><br><span class="line-number">92</span><br><span class="line-number">93</span><br><span class="line-number">94</span><br><span class="line-number">95</span><br><span class="line-number">96</span><br><span class="line-number">97</span><br><span class="line-number">98</span><br><span class="line-number">99</span><br><span class="line-number">100</span><br><span class="line-number">101</span><br><span class="line-number">102</span><br><span class="line-number">103</span><br><span class="line-number">104</span><br><span class="line-number">105</span><br><span class="line-number">106</span><br><span class="line-number">107</span><br><span class="line-number">108</span><br><span class="line-number">109</span><br><span class="line-number">110</span><br><span class="line-number">111</span><br><span class="line-number">112</span><br><span class="line-number">113</span><br><span class="line-number">114</span><br><span class="line-number">115</span><br><span class="line-number">116</span><br><span class="line-number">117</span><br><span class="line-number">118</span><br><span class="line-number">119</span><br><span class="line-number">120</span><br><span class="line-number">121</span><br><span class="line-number">122</span><br><span class="line-number">123</span><br><span class="line-number">124</span><br><span class="line-number">125</span><br><span class="line-number">126</span><br><span class="line-number">127</span><br><span class="line-number">128</span><br><span class="line-number">129</span><br><span class="line-number">130</span><br><span class="line-number">131</span><br><span class="line-number">132</span><br><span class="line-number">133</span><br><span class="line-number">134</span><br><span class="line-number">135</span><br><span class="line-number">136</span><br><span class="line-number">137</span><br><span class="line-number">138</span><br><span class="line-number">139</span><br><span class="line-number">140</span><br><span class="line-number">141</span><br><span class="line-number">142</span><br><span class="line-number">143</span><br><span class="line-number">144</span><br><span class="line-number">145</span><br><span class="line-number">146</span><br><span class="line-number">147</span><br><span class="line-number">148</span><br><span class="line-number">149</span><br><span class="line-number">150</span><br><span class="line-number">151</span><br><span class="line-number">152</span><br><span class="line-number">153</span><br><span class="line-number">154</span><br><span class="line-number">155</span><br><span class="line-number">156</span><br><span class="line-number">157</span><br><span class="line-number">158</span><br><span class="line-number">159</span><br><span class="line-number">160</span><br><span class="line-number">161</span><br><span class="line-number">162</span><br><span class="line-number">163</span><br><span class="line-number">164</span><br><span class="line-number">165</span><br><span class="line-number">166</span><br><span class="line-number">167</span><br><span class="line-number">168</span><br><span class="line-number">169</span><br><span class="line-number">170</span><br><span class="line-number">171</span><br><span class="line-number">172</span><br><span class="line-number">173</span><br><span class="line-number">174</span><br><span class="line-number">175</span><br><span class="line-number">176</span><br><span class="line-number">177</span><br><span class="line-number">178</span><br><span class="line-number">179</span><br><span class="line-number">180</span><br><span class="line-number">181</span><br><span class="line-number">182</span><br><span class="line-number">183</span><br><span class="line-number">184</span><br><span class="line-number">185</span><br><span class="line-number">186</span><br><span class="line-number">187</span><br><span class="line-number">188</span><br><span class="line-number">189</span><br><span class="line-number">190</span><br><span class="line-number">191</span><br><span class="line-number">192</span><br><span class="line-number">193</span><br><span class="line-number">194</span><br><span class="line-number">195</span><br><span class="line-number">196</span><br><span class="line-number">197</span><br><span class="line-number">198</span><br><span class="line-number">199</span><br><span class="line-number">200</span><br><span class="line-number">201</span><br><span class="line-number">202</span><br><span class="line-number">203</span><br><span class="line-number">204</span><br><span class="line-number">205</span><br><span class="line-number">206</span><br><span class="line-number">207</span><br><span class="line-number">208</span><br><span class="line-number">209</span><br><span class="line-number">210</span><br><span class="line-number">211</span><br><span class="line-number">212</span><br><span class="line-number">213</span><br><span class="line-number">214</span><br><span class="line-number">215</span><br><span class="line-number">216</span><br><span class="line-number">217</span><br><span class="line-number">218</span><br><span class="line-number">219</span><br><span class="line-number">220</span><br><span class="line-number">221</span><br><span class="line-number">222</span><br><span class="line-number">223</span><br><span class="line-number">224</span><br><span class="line-number">225</span><br><span class="line-number">226</span><br><span class="line-number">227</span><br><span class="line-number">228</span><br><span class="line-number">229</span><br><span class="line-number">230</span><br><span class="line-number">231</span><br><span class="line-number">232</span><br><span class="line-number">233</span><br><span class="line-number">234</span><br><span class="line-number">235</span><br><span class="line-number">236</span><br><span class="line-number">237</span><br><span class="line-number">238</span><br><span class="line-number">239</span><br><span class="line-number">240</span><br><span class="line-number">241</span><br><span class="line-number">242</span><br><span class="line-number">243</span><br><span class="line-number">244</span><br><span class="line-number">245</span><br><span class="line-number">246</span><br><span class="line-number">247</span><br><span class="line-number">248</span><br><span class="line-number">249</span><br><span class="line-number">250</span><br><span class="line-number">251</span><br><span class="line-number">252</span><br><span class="line-number">253</span><br><span class="line-number">254</span><br><span class="line-number">255</span><br><span class="line-number">256</span><br><span class="line-number">257</span><br><span class="line-number">258</span><br><span class="line-number">259</span><br><span class="line-number">260</span><br><span class="line-number">261</span><br><span class="line-number">262</span><br><span class="line-number">263</span><br><span class="line-number">264</span><br><span class="line-number">265</span><br><span class="line-number">266</span><br><span class="line-number">267</span><br><span class="line-number">268</span><br><span class="line-number">269</span><br><span class="line-number">270</span><br><span class="line-number">271</span><br><span class="line-number">272</span><br><span class="line-number">273</span><br><span class="line-number">274</span><br><span class="line-number">275</span><br><span class="line-number">276</span><br><span class="line-number">277</span><br><span class="line-number">278</span><br><span class="line-number">279</span><br><span class="line-number">280</span><br><span class="line-number">281</span><br><span class="line-number">282</span><br><span class="line-number">283</span><br><span class="line-number">284</span><br><span class="line-number">285</span><br><span class="line-number">286</span><br><span class="line-number">287</span><br><span class="line-number">288</span><br><span class="line-number">289</span><br><span class="line-number">290</span><br><span class="line-number">291</span><br><span class="line-number">292</span><br><span class="line-number">293</span><br><span class="line-number">294</span><br><span class="line-number">295</span><br><span class="line-number">296</span><br><span class="line-number">297</span><br><span class="line-number">298</span><br><span class="line-number">299</span><br><span class="line-number">300</span><br><span class="line-number">301</span><br><span class="line-number">302</span><br><span class="line-number">303</span><br><span class="line-number">304</span><br><span class="line-number">305</span><br><span class="line-number">306</span><br><span class="line-number">307</span><br><span class="line-number">308</span><br><span class="line-number">309</span><br><span class="line-number">310</span><br><span class="line-number">311</span><br><span class="line-number">312</span><br><span class="line-number">313</span><br><span class="line-number">314</span><br><span class="line-number">315</span><br><span class="line-number">316</span><br><span class="line-number">317</span><br><span class="line-number">318</span><br><span class="line-number">319</span><br><span class="line-number">320</span><br><span class="line-number">321</span><br><span class="line-number">322</span><br><span class="line-number">323</span><br><span class="line-number">324</span><br><span class="line-number">325</span><br><span class="line-number">326</span><br><span class="line-number">327</span><br><span class="line-number">328</span><br><span class="line-number">329</span><br><span class="line-number">330</span><br><span class="line-number">331</span><br><span class="line-number">332</span><br><span class="line-number">333</span><br><span class="line-number">334</span><br><span class="line-number">335</span><br><span class="line-number">336</span><br><span class="line-number">337</span><br><span class="line-number">338</span><br><span class="line-number">339</span><br><span class="line-number">340</span><br><span class="line-number">341</span><br><span class="line-number">342</span><br><span class="line-number">343</span><br><span class="line-number">344</span><br><span class="line-number">345</span><br><span class="line-number">346</span><br><span class="line-number">347</span><br><span class="line-number">348</span><br><span class="line-number">349</span><br><span class="line-number">350</span><br><span class="line-number">351</span><br><span class="line-number">352</span><br><span class="line-number">353</span><br><span class="line-number">354</span><br><span class="line-number">355</span><br><span class="line-number">356</span><br><span class="line-number">357</span><br><span class="line-number">358</span><br><span class="line-number">359</span><br><span class="line-number">360</span><br><span class="line-number">361</span><br><span class="line-number">362</span><br><span class="line-number">363</span><br><span class="line-number">364</span><br><span class="line-number">365</span><br><span class="line-number">366</span><br><span class="line-number">367</span><br><span class="line-number">368</span><br><span class="line-number">369</span><br><span class="line-number">370</span><br><span class="line-number">371</span><br><span class="line-number">372</span><br><span class="line-number">373</span><br><span class="line-number">374</span><br><span class="line-number">375</span><br><span class="line-number">376</span><br><span class="line-number">377</span><br><span class="line-number">378</span><br><span class="line-number">379</span><br><span class="line-number">380</span><br><span class="line-number">381</span><br><span class="line-number">382</span><br><span class="line-number">383</span><br><span class="line-number">384</span><br><span class="line-number">385</span><br><span class="line-number">386</span><br><span class="line-number">387</span><br><span class="line-number">388</span><br><span class="line-number">389</span><br><span class="line-number">390</span><br><span class="line-number">391</span><br><span class="line-number">392</span><br><span class="line-number">393</span><br><span class="line-number">394</span><br><span class="line-number">395</span><br><span class="line-number">396</span><br><span class="line-number">397</span><br><span class="line-number">398</span><br><span class="line-number">399</span><br><span class="line-number">400</span><br><span class="line-number">401</span><br><span class="line-number">402</span><br><span class="line-number">403</span><br><span class="line-number">404</span><br><span class="line-number">405</span><br><span class="line-number">406</span><br><span class="line-number">407</span><br><span class="line-number">408</span><br><span class="line-number">409</span><br><span class="line-number">410</span><br><span class="line-number">411</span><br><span class="line-number">412</span><br><span class="line-number">413</span><br><span class="line-number">414</span><br><span class="line-number">415</span><br><span class="line-number">416</span><br><span class="line-number">417</span><br><span class="line-number">418</span><br><span class="line-number">419</span><br><span class="line-number">420</span><br><span class="line-number">421</span><br><span class="line-number">422</span><br><span class="line-number">423</span><br><span class="line-number">424</span><br><span class="line-number">425</span><br><span class="line-number">426</span><br><span class="line-number">427</span><br><span class="line-number">428</span><br><span class="line-number">429</span><br><span class="line-number">430</span><br><span class="line-number">431</span><br><span class="line-number">432</span><br><span class="line-number">433</span><br><span class="line-number">434</span><br><span class="line-number">435</span><br><span class="line-number">436</span><br><span class="line-number">437</span><br><span class="line-number">438</span><br><span class="line-number">439</span><br><span class="line-number">440</span><br><span class="line-number">441</span><br><span class="line-number">442</span><br><span class="line-number">443</span><br><span class="line-number">444</span><br></div></div></div></details><div class="vp-code-block-title"><div class="vp-code-block-title-bar"><span class="vp-code-block-title-text" data-title="index.ts">index.ts</span></div><div class="language-ts vp-adaptive-theme line-numbers-mode"><button title="复制代码" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes OneLight dark-plus vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">import</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> &#39;./rainbow.css&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div><h2 id="导航栏毛玻璃" tabindex="-1">导航栏毛玻璃 <a class="header-anchor" href="#导航栏毛玻璃" aria-label="Permalink to &quot;导航栏毛玻璃&quot;">​</a></h2><p><span class="img-wrapper"><img src="https://cdn.jsdelivr.net/gh/dcdy/image/img/image-20241217153300542.png" alt="image-20241217153300542" width="auto" height="auto" class="img-loading" onload="this.classList.remove(&#39;img-loading&#39;)" onerror="this.classList.remove(&#39;img-loading&#39;); this.classList.add(&#39;img-error&#39;)"></span></p><p>新建<code>docs/.vitepress/theme/blur.css</code> 文件</p><details class="details custom-block"><summary>点击查看<code>blur.css</code> 文件内容</summary><div class="vp-code-block-title"><div class="vp-code-block-title-bar"><span class="vp-code-block-title-text" data-title="blur.css">blur.css</span></div><div class="language-css vp-adaptive-theme line-numbers-mode"><button title="复制代码" class="copy"></button><span class="lang">css</span><pre class="shiki shiki-themes OneLight dark-plus vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">/* .vitepress\theme\style\blur.css */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">:root</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/* 首页下滑后导航透明 */</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	.VPNavBar:not(.has-sidebar):not(.home.</span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">top</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		background-color</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">rgba</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">0</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		backdrop-filter</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">blur</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">10px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/* 搜索框透明 */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">	.DocSearch-Button</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		background-color</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">rgba</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">0</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		backdrop-filter</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">blur</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">10px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">	@media</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> (</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">min-width</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">768px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) {</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">		.DocSearch-Button</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">			border</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">1px</span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;"> solid</span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;"> var</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">--vp-c-gray-1</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">		}</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/* Feature透明 */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">	.VPFeature</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		border</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">none</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		box-shadow</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">0</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 10px</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 30px</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 0</span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;"> rgb</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">0</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 0</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 0</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> / </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">15%</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		background-color</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">transparent</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/* 文档页侧边栏顶部透明 */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">	.curtain</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		background-color</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">rgba</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">0</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		backdrop-filter</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">blur</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">10px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">	@media</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> (</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">min-width</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">960px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) {</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">		/* 文档页导航中间透明 */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">		.VPNavBar:not</span><span style="--shiki-light:#A626A4;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">.home.top</span><span style="--shiki-light:#A626A4;--shiki-dark:#D4D4D4;">) </span><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">.content-body</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">			background-color</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">rgba</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">0</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">			backdrop-filter</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">blur</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">10px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">		}</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">		.NavBarHiddenLeftAside</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">			background-color</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">rgba</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">0</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">			backdrop-filter</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">blur</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">10px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">		}</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/* 移动端大纲栏透明 */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">	.VPLocalNav</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		background-color</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">rgba</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">255</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">0</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		backdrop-filter</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;">blur</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">10px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br><span class="line-number">43</span><br><span class="line-number">44</span><br><span class="line-number">45</span><br><span class="line-number">46</span><br><span class="line-number">47</span><br><span class="line-number">48</span><br><span class="line-number">49</span><br><span class="line-number">50</span><br></div></div></div></details><div class="vp-code-block-title"><div class="vp-code-block-title-bar"><span class="vp-code-block-title-text" data-title="index.ts">index.ts</span></div><div class="language-ts vp-adaptive-theme line-numbers-mode"><button title="复制代码" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes OneLight dark-plus vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">import</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> &#39;./blur.css&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div><h2 id="隐藏横条" tabindex="-1">隐藏横条 <a class="header-anchor" href="#隐藏横条" aria-label="Permalink to &quot;隐藏横条&quot;">​</a></h2><p>隐藏文档中部分横条。 新建<code>docs/.vitepress/theme/hidden-line.css</code> 文件</p><details class="details custom-block"><summary>点击查看<code>hidden-line.css</code> 文件内容</summary><div class="vp-code-block-title"><div class="vp-code-block-title-bar"><span class="vp-code-block-title-text" data-title="hidden-line.css">hidden-line.css</span></div><div class="language-css vp-adaptive-theme line-numbers-mode"><button title="复制代码" class="copy"></button><span class="lang">css</span><pre class="shiki shiki-themes OneLight dark-plus vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">/* .vitepress\theme\style\hidden.css */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">:root</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/* 文档页Logo出文字下横条 */</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	@media (</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">min-width</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">960px</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) {</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">		.VPNavBarTitle.has-sidebar .title {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">			border-bottom-color</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">transparent</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">		}</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/* 页脚横条隐藏 */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">	.VPFooter</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		border-top</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">none</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/* 手机端菜单栏顶部横条隐藏 */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">	.VPNavBar.screen-open</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		border-bottom</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">none</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/* 手机端菜单栏菜单分割线隐藏 */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">	.VPNavScreenMenuLink</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		border-bottom</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">none</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/* 手机端菜单组隐藏 */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">	.VPNavScreenMenuGroup</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		border-bottom</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">none</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/* 手机端大纲栏横条隐藏 */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">	.VPLocalNav</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		border-bottom</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">none</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">/* 导航栏下划线隐藏 */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">.divider</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">	display</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">none</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">/* 上下页上方线隐藏 */</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">.VPDocFooter</span><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;"> .prev-next</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">	border-top</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">none</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br><span class="line-number">43</span><br></div></div></div></details><div class="vp-code-block-title"><div class="vp-code-block-title-bar"><span class="vp-code-block-title-text" data-title="index.ts">index.ts</span></div><div class="language-ts vp-adaptive-theme line-numbers-mode"><button title="复制代码" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes OneLight dark-plus vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">import</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> &#39;./hidden-line.css&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div><h2 id="视图过渡" tabindex="-1">视图过渡 <a class="header-anchor" href="#视图过渡" aria-label="Permalink to &quot;视图过渡&quot;">​</a></h2><p><span class="img-wrapper"><img src="https://vitepress.dev/appearance-toggle-transition.webp" alt="视图过渡" width="auto" height="auto" class="img-loading" onload="this.classList.remove(&#39;img-loading&#39;)" onerror="this.classList.remove(&#39;img-loading&#39;); this.classList.add(&#39;img-error&#39;)"></span></p><ol><li><p>新建<code>docs/.vitepress/theme/view-transition.ts</code>文件</p><details class="details custom-block"><summary>点击查看 <code>view-transition.ts</code>文件内容</summary><div class="vp-code-block-title"><div class="vp-code-block-title-bar"><span class="vp-code-block-title-text" data-title="view-transition.ts">view-transition.ts</span></div><div class="language-ts vp-adaptive-theme line-numbers-mode"><button title="复制代码" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes OneLight dark-plus vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">import</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> { </span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">nextTick</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> } </span><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">from</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> &#39;vue&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">import</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> { </span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">useData</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> } </span><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">from</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> &#39;vitepress&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">export</span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;"> function</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;"> useAppearanceTransition</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">() {</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">	const</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> { </span><span style="--shiki-light:#986801;--shiki-dark:#4FC1FF;">isDark</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> } </span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;">=</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;"> useData</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">();</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	// 判断是否支持 View Transition 和动画效果</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">	const</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;"> enableTransitions</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> =</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> () </span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">=&gt;</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">		&#39;startViewTransition&#39;</span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;"> in</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> document</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> &amp;&amp;</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;"> window</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">matchMedia</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">&#39;(prefers-reduced-motion: no-preference)&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">).</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">matches</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	// 提供 toggle-appearance 方法，切换主题</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">	const</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;"> toggleAppearance</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> =</span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;"> async</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> ({ </span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">clientX</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">x</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">clientY</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">y</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> }</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;">:</span><span style="--shiki-light:#C18401;--shiki-dark:#4EC9B0;"> MouseEvent</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) </span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">=&gt;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">		if</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> (</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;">!</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">enableTransitions</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">()) {</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">			isDark</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">value</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> =</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> !</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">isDark</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">value</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">			return</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">		}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">		const</span><span style="--shiki-light:#986801;--shiki-dark:#4FC1FF;"> clipPath</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> =</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> [</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">			`circle(0px at </span><span style="--shiki-light:#CA1243;--shiki-dark:#569CD6;">${</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">x</span><span style="--shiki-light:#CA1243;--shiki-dark:#569CD6;">}</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">px </span><span style="--shiki-light:#CA1243;--shiki-dark:#569CD6;">${</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">y</span><span style="--shiki-light:#CA1243;--shiki-dark:#569CD6;">}</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">px)`</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">			`circle(</span><span style="--shiki-light:#CA1243;--shiki-dark:#569CD6;">${</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">Math</span><span style="--shiki-light:#50A14F;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">hypot</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">Math</span><span style="--shiki-light:#50A14F;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">max</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">x</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> innerWidth</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> -</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> x</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">),</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;"> Math</span><span style="--shiki-light:#50A14F;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">max</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">y</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> innerHeight</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> -</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> y</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">))</span><span style="--shiki-light:#CA1243;--shiki-dark:#569CD6;">}</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">px at </span><span style="--shiki-light:#CA1243;--shiki-dark:#569CD6;">${</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">x</span><span style="--shiki-light:#CA1243;--shiki-dark:#569CD6;">}</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">px </span><span style="--shiki-light:#CA1243;--shiki-dark:#569CD6;">${</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">y</span><span style="--shiki-light:#CA1243;--shiki-dark:#569CD6;">}</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">px)`</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">		];</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">		await</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;"> document</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">startViewTransition</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">async</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> () </span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">=&gt;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">			isDark</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">value</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> =</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> !</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">isDark</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">value</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">			await</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;"> nextTick</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">();</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">		}).</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">ready</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">		document</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">documentElement</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">animate</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">			{ </span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">clipPath</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;"> isDark</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">value</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> ?</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;"> clipPath</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">reverse</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">() </span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;">:</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> clipPath</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> },</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">			{</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">				duration</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 300</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">				easing</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> &#39;ease-in&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">				pseudoElement</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> `::view-transition-</span><span style="--shiki-light:#CA1243;--shiki-dark:#569CD6;">${</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">isDark</span><span style="--shiki-light:#50A14F;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">value</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> ?</span><span style="--shiki-light:#CA1243;--shiki-dark:#CE9178;"> &#39;</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">old</span><span style="--shiki-light:#CA1243;--shiki-dark:#CE9178;">&#39;</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> :</span><span style="--shiki-light:#CA1243;--shiki-dark:#CE9178;"> &#39;</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">new</span><span style="--shiki-light:#CA1243;--shiki-dark:#CE9178;">&#39;</span><span style="--shiki-light:#CA1243;--shiki-dark:#569CD6;">}</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">(root)`</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">			}</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">		);</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	};</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">	return</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">		toggleAppearance</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	};</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br></div></div></div></details></li><li><p>新建<code>docs/.vitepress/theme/view-transition.css</code>文件</p><details class="details custom-block"><summary>点击查看 <code>view-transition.css</code>文件内容</summary><div class="vp-code-block-title"><div class="vp-code-block-title-bar"><span class="vp-code-block-title-text" data-title="view-transition.css">view-transition.css</span></div><div class="language-css vp-adaptive-theme line-numbers-mode"><button title="复制代码" class="copy"></button><span class="lang">css</span><pre class="shiki shiki-themes OneLight dark-plus vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#D4D4D4;">::view-transition-old(root</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">),</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#D4D4D4;">::view-transition-new(root</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">	animation</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">none</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">	mix-blend-mode</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">normal</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#D4D4D4;">::view-transition-old(root</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">),</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">.dark</span><span style="--shiki-light:#A626A4;--shiki-dark:#D4D4D4;">::view-transition-new(root</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">	z-index</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">1</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#D4D4D4;">::view-transition-new(root</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">),</span></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">.dark</span><span style="--shiki-light:#A626A4;--shiki-dark:#D4D4D4;">::view-transition-old(root</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">	z-index</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">9999</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">.VPSwitchAppearance</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">	width</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">22px</span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;"> !important</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;">.VPSwitchAppearance</span><span style="--shiki-light:#986801;--shiki-dark:#D7BA7D;"> .check</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">	transform</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">: </span><span style="--shiki-light:#383A42;--shiki-dark:#CE9178;">none</span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;"> !important</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">}</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br></div></div></div></details></li><li><p><code>CustomLayoutSlot.vue</code>文件中引入 <code>view-transition.ts</code>和 <code>view-transition.css</code></p><div class="vp-code-block-title"><div class="vp-code-block-title-bar"><span class="vp-code-block-title-text" data-title="CustomLayoutSlot.vue">CustomLayoutSlot.vue</span></div><div class="language-vue vp-adaptive-theme line-numbers-mode"><button title="复制代码" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes OneLight dark-plus vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&lt;</span><span style="--shiki-light:#E45649;--shiki-dark:#569CD6;">script</span><span style="--shiki-light:#986801;--shiki-dark:#9CDCFE;"> setup</span><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">// ...其他模块的导入内容</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">// TAG引用切换模式时的视图过渡效果👇</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">import</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> { </span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">provide</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> } </span><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">from</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> &#39;vue&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">import</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> { </span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">useAppearanceTransition</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> } </span><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">from</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> &#39;../view-transition.ts&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">// 使用自定义的 hook</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">const</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> { </span><span style="--shiki-light:#986801;--shiki-dark:#4FC1FF;">toggleAppearance</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> } </span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;">=</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;"> useAppearanceTransition</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">();</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">// 提供 toggle-appearance 方法</span></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">provide</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">&#39;toggle-appearance&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">toggleAppearance</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">// TAG引用切换模式时的视图过渡效果👆</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&lt;/</span><span style="--shiki-light:#E45649;--shiki-dark:#569CD6;">script</span><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&lt;</span><span style="--shiki-light:#E45649;--shiki-dark:#569CD6;">style</span><span style="--shiki-light:#986801;--shiki-dark:#9CDCFE;"> lang</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">=</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">&quot;scss&quot;</span><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">/* 引用切换模式时的视图过渡效果 */</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">@import</span><span style="--shiki-light:#0184BC;--shiki-dark:#DCDCAA;"> url</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">../view-transition.css</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">/* ...其他内容 */</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&lt;/</span><span style="--shiki-light:#E45649;--shiki-dark:#569CD6;">style</span><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br></div></div></div></li></ol><h2 id="五彩纸屑" tabindex="-1">五彩纸屑 <a class="header-anchor" href="#五彩纸屑" aria-label="Permalink to &quot;五彩纸屑&quot;">​</a></h2><p><span class="img-wrapper"><img src="https://cdn.jsdelivr.net/gh/dcdy/image/img/GIF%202024-12-17%2015-43-03_compressed.gif" alt="GIF 2024-12-17 15-43-03_compressed" width="auto" height="auto" class="img-loading" onload="this.classList.remove(&#39;img-loading&#39;)" onerror="this.classList.remove(&#39;img-loading&#39;); this.classList.add(&#39;img-error&#39;)"></span></p><h3 id="安装" tabindex="-1">安装 <a class="header-anchor" href="#安装" aria-label="Permalink to &quot;安装&quot;">​</a></h3><p>地址：<a href="https://github.com/catdad/canvas-confetti" target="_blank" rel="noreferrer">https://github.com/catdad/canvas-confetti</a></p><div class="language-shell vp-adaptive-theme line-numbers-mode"><button title="复制代码" class="copy"></button><span class="lang">shell</span><pre class="shiki shiki-themes OneLight dark-plus vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">pnpm</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> add</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> canvas-confetti</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h3 id="配置" tabindex="-1">配置 <a class="header-anchor" href="#配置" aria-label="Permalink to &quot;配置&quot;">​</a></h3><ol><li><p>新建组件<code>.vitepress/theme/components/Confetti.vue</code></p><details class="details custom-block"><summary>点击查看<code>Confetti.vue</code>文件内容</summary><div class="vp-code-block-title"><div class="vp-code-block-title-bar"><span class="vp-code-block-title-text" data-title="Confetti.vue">Confetti.vue</span></div><div class="language-vue vp-adaptive-theme line-numbers-mode"><button title="复制代码" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes OneLight dark-plus vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">&lt;!-- 五彩纸屑 --&gt;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&lt;</span><span style="--shiki-light:#E45649;--shiki-dark:#569CD6;">template</span><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&gt;&lt;/</span><span style="--shiki-light:#E45649;--shiki-dark:#569CD6;">template</span><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&lt;</span><span style="--shiki-light:#E45649;--shiki-dark:#569CD6;">script</span><span style="--shiki-light:#986801;--shiki-dark:#9CDCFE;"> setup</span><span style="--shiki-light:#986801;--shiki-dark:#9CDCFE;"> lang</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">=</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">&quot;ts&quot;</span><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">import</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;"> confetti</span><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;"> from</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> &#39;canvas-confetti&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">import</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> { </span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">onMounted</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> } </span><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">from</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> &#39;vue&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">onMounted</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(() </span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">=&gt;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">	/* 大量纸屑效果 */</span></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">	largeConfetti</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">();</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">});</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">/* 简易纸屑效果 */</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">const</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;"> simpleConfetti</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> =</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> () </span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">=&gt;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">	confetti</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">({</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		particleCount</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 100</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		spread</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 170</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		origin</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> { </span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">y</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 0.6</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> },</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	});</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">};</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">/* 大量纸屑效果 */</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">const</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;"> largeConfetti</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> =</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> () </span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">=&gt;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">	var</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> count</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> =</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 200</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">	var</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> defaults</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> =</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		origin</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> { </span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">y</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 0.7</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> },</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	};</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">	function</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;"> fire</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">particleRatio</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">opts</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) {</span></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">		confetti</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">({</span></span>
<span class="line"><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;">			...</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">defaults</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;">			...</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">opts</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">			particleCount</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;"> Math</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">floor</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">count</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> *</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> particleRatio</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">),</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">		});</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">	fire</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">0.25</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		spread</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 26</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		startVelocity</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 55</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	});</span></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">	fire</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">0.2</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		spread</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 60</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	});</span></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">	fire</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">0.35</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		spread</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 100</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		decay</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 0.91</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		scalar</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 0.8</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	});</span></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">	fire</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">0.1</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		spread</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 120</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		startVelocity</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 25</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		decay</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 0.92</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		scalar</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 1.2</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	});</span></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">	fire</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;">0.1</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		spread</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 120</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">		startVelocity</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 45</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	});</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">};</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">/* 两侧纸屑效果 */</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">const</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;"> sideConfetti</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> =</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> () </span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">=&gt;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">	var</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> end</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> =</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;"> Date</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">now</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">() </span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;">+</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 3</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> *</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 1000</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">	var</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> colors</span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;"> =</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> [</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">&#39;#FC7792&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">&#39;#FCB34F&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">];</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	(</span><span style="--shiki-light:#A626A4;--shiki-dark:#569CD6;">function</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;"> frame</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">() {</span></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">		confetti</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">({</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">			particleCount</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 2</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">			angle</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 60</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">			spread</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 55</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">			origin</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> { </span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">x</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 0</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> },</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">			colors</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> colors</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">		});</span></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">		confetti</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">({</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">			particleCount</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 2</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">			angle</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 120</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">			spread</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 55</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">			origin</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> { </span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">x</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#986801;--shiki-dark:#B5CEA8;"> 1</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> },</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">			colors</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> colors</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">		});</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">		if</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> (</span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">Date</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">now</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">() </span><span style="--shiki-light:#0184BC;--shiki-dark:#D4D4D4;">&lt;</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;"> end</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">) {</span></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">			requestAnimationFrame</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#50A14F;--shiki-dark:#9CDCFE;">frame</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">		}</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	})();</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">};</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&lt;/</span><span style="--shiki-light:#E45649;--shiki-dark:#569CD6;">script</span><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br><span class="line-number">36</span><br><span class="line-number">37</span><br><span class="line-number">38</span><br><span class="line-number">39</span><br><span class="line-number">40</span><br><span class="line-number">41</span><br><span class="line-number">42</span><br><span class="line-number">43</span><br><span class="line-number">44</span><br><span class="line-number">45</span><br><span class="line-number">46</span><br><span class="line-number">47</span><br><span class="line-number">48</span><br><span class="line-number">49</span><br><span class="line-number">50</span><br><span class="line-number">51</span><br><span class="line-number">52</span><br><span class="line-number">53</span><br><span class="line-number">54</span><br><span class="line-number">55</span><br><span class="line-number">56</span><br><span class="line-number">57</span><br><span class="line-number">58</span><br><span class="line-number">59</span><br><span class="line-number">60</span><br><span class="line-number">61</span><br><span class="line-number">62</span><br><span class="line-number">63</span><br><span class="line-number">64</span><br><span class="line-number">65</span><br><span class="line-number">66</span><br><span class="line-number">67</span><br><span class="line-number">68</span><br><span class="line-number">69</span><br><span class="line-number">70</span><br><span class="line-number">71</span><br><span class="line-number">72</span><br><span class="line-number">73</span><br><span class="line-number">74</span><br><span class="line-number">75</span><br><span class="line-number">76</span><br><span class="line-number">77</span><br><span class="line-number">78</span><br><span class="line-number">79</span><br><span class="line-number">80</span><br><span class="line-number">81</span><br><span class="line-number">82</span><br><span class="line-number">83</span><br></div></div></div></details></li><li><p>在 <code>index.ts</code> 中注册全局组件</p><div class="vp-code-block-title"><div class="vp-code-block-title-bar"><span class="vp-code-block-title-text" data-title="index.ts">index.ts</span></div><div class="language-ts vp-adaptive-theme line-numbers-mode"><button title="复制代码" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes OneLight dark-plus vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">// 五彩纸屑</span></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">import</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;"> Confetti</span><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;"> from</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;"> &#39;./components/Confetti.vue&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A626A4;--shiki-dark:#C586C0;">export</span><span style="--shiki-light:#E45649;--shiki-dark:#C586C0;"> default</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> {</span></span>
<span class="line"><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">	extends</span><span style="--shiki-light:#0184BC;--shiki-dark:#9CDCFE;">:</span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;"> DefaultTheme</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">,</span></span>
<span class="line"><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">	enhanceApp</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">({ </span><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">app</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;"> }) {</span></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">		// 全局注册五彩纸屑组件</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#9CDCFE;">		app</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">.</span><span style="--shiki-light:#4078F2;--shiki-dark:#DCDCAA;">component</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">(</span><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">&#39;Confetti&#39;</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">, </span><span style="--shiki-light:#E45649;--shiki-dark:#9CDCFE;">Confetti</span><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">);</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">	},</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">};</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br></div></div></div></li></ol><h3 id="使用" tabindex="-1">使用 <a class="header-anchor" href="#使用" aria-label="Permalink to &quot;使用&quot;">​</a></h3><p>在任意.md 文件下添加 <code>&lt;Confetti /&gt;</code></p><p>例如在首页 <code>index.md</code>中添加五彩纸屑效果</p><div class="language-markdown vp-adaptive-theme line-numbers-mode"><button title="复制代码" class="copy"></button><span class="lang">markdown</span><pre class="shiki shiki-themes OneLight dark-plus vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">---</span></span>
<span class="line"><span style="--shiki-light:#50A14F;--shiki-dark:#CE9178;">&lt;!-- 其他内容 --&gt;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#D4D4D4;">---</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#A0A1A7;--shiki-dark:#6A9955;--shiki-light-font-style:italic;--shiki-dark-font-style:inherit;">&lt;!-- 五彩纸屑 --&gt;</span></span>
<span class="line"><span style="--shiki-light:#383A42;--shiki-dark:#808080;">&lt;</span><span style="--shiki-light:#E45649;--shiki-dark:#569CD6;">Confetti</span><span style="--shiki-light:#383A42;--shiki-dark:#808080;"> /&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br></div></div></div></div></main><footer class="VPDocFooter" data-v-09fc73c3 data-v-a242629a><!--[--><!--[--><!--[--><!--[--><div style="display:none;" class="vitepress-backTop-main" title="返回顶部" data-v-62b2871c><svg t="1720595052079" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4279" width="200" height="200" data-v-62b2871c><path d="M752.736 431.063C757.159 140.575 520.41 8.97 504.518 0.41V0l-0.45 0.205-0.41-0.205v0.41c-15.934 8.56-252.723 140.165-248.259 430.653-48.21 31.457-98.713 87.368-90.685 184.074 8.028 96.666 101.007 160.768 136.601 157.287 35.595-3.482 25.232-30.31 25.232-30.31l12.206-50.095s52.47 80.569 69.304 80.528c15.114-1.23 87-0.123 95.6 0h0.82c8.602-0.123 80.486-1.23 95.6 0 16.794 0 69.305-80.528 69.305-80.528l12.165 50.094s-10.322 26.83 25.272 30.31c35.595 3.482 128.574-60.62 136.602-157.286 8.028-96.665-42.475-152.617-90.685-184.074z m-248.669-4.26c-6.758-0.123-94.781-3.359-102.891-107.192 2.95-98.714 95.97-107.438 102.891-107.93 6.964 0.492 99.943 9.216 102.892 107.93-8.11 103.833-96.174 107.07-102.892 107.192z m-52.019 500.531c0 11.838-9.42 21.382-21.012 21.382a21.217 21.217 0 0 1-21.054-21.34V821.74c0-11.797 9.421-21.382 21.054-21.382 11.591 0 21.012 9.585 21.012 21.382v105.635z m77.333 57.222a21.504 21.504 0 0 1-21.34 21.626 21.504 21.504 0 0 1-21.34-21.626V827.474c0-11.96 9.543-21.668 21.299-21.668 11.796 0 21.38 9.708 21.38 21.668v157.082z m71.147-82.043c0 11.796-9.42 21.34-21.053 21.34a21.217 21.217 0 0 1-21.013-21.34v-75.367c0-11.755 9.421-21.299 21.013-21.299 11.632 0 21.053 9.544 21.053 21.3v75.366z" fill="#FFF" p-id="4280" data-v-62b2871c></path></svg></div><!--]--><!--]--><!--]--><!--]--><div class="edit-info" data-v-a242629a><div class="edit-link" data-v-a242629a><a class="VPLink link vp-external-link-icon no-icon edit-link-button" href="https://github.com/dcdy/vitepress-template/edit/main/docs/guide/plugin/style.md" target="_blank" rel="noreferrer" data-v-a242629a><!--[--><span class="vpi-square-pen edit-link-icon" data-v-a242629a></span> 在 GitHub 上编辑此页面<!--]--></a></div><div class="last-updated" data-v-a242629a><p class="VPLastUpdated" data-v-a242629a data-v-6712e2c8>最后更新于: <time datetime="2024-12-18T09:43:43.000Z" data-v-6712e2c8></time></p></div></div><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-a242629a><span class="visually-hidden" id="doc-footer-aria-label" data-v-a242629a>Pager</span><div class="pager" data-v-a242629a><a class="VPLink link pager-link prev" href="/vitepress-template-public/guide/plugin/code" data-v-a242629a><!--[--><span class="desc" data-v-a242629a>上一页</span><span class="title" data-v-a242629a>代码块</span><!--]--></a></div><div class="pager" data-v-a242629a><a class="VPLink link pager-link next" href="/vitepress-template-public/guide/plugin/util" data-v-a242629a><!--[--><span class="desc" data-v-a242629a>下一页</span><span class="title" data-v-a242629a>一些组件</span><!--]--></a></div></nav></footer><!--[--><!--[--><!--[--><!----><!--]--><!--]--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-e7ae3156 data-v-34aa0b55><div class="container" data-v-34aa0b55><p class="message" data-v-34aa0b55>基于MIT许可发布</p><p class="copyright" data-v-34aa0b55>版权所有 © 2024 dcdyxmt@163.com</p></div></footer><!--[--><!--]--></div></div>
    
    
  </body>
</html>